<template>
  <div>
    <!-- :initial-value="form.fileList" -->
    <ImportUploadFile ref="UploadFile" :autoUpload="false" :autoUploadDisplay="false" :action-url="actionUrl" :params="params" @change="successHandler" @error="errorHandler" :fileTypes="['xls', 'xlsx']"
      >选取附件
    </ImportUploadFile>
    <div style="text-align: center;margin: 10px;">
      <el-button size="small" @click="saveHandle" :loading="importLoading" type="primary">{{ title }}</el-button>
      <el-button size="small" @click="cancle" type="">关闭</el-button>
    </div>
    <FilterTable ref="table" :columns="columns" :dataSource="errorList" :datakey="'records'" :isSelectColumn="false" :onColumnsChange="columns => (this.columns = columns)" style="margin-top: 10px">
    </FilterTable>
  </div>
</template>
<script>
/**
 * @Author: 焦质晔
 * @Date: 2019-12-17 11:02:48
 * @Last Modified by: mikey.zhaopeng
 * @Last Modified time: 2019-12-17 14:20:49
 **/
import { dictionary } from '@/utils/dictMixin';
import { getToken, getAppId } from '@/assets/js/auth';
import axios, { getConfigHeaders } from '@/api/fetch';
import ImportUploadFile from '@/components/ImportUploadFile';

export default {
  name: 'importFile',
  mixins: [dictionary],
  comments: {
    ImportUploadFile
  },
  props: {
    title: {
      type: String,
      required: true
    },
    actionUrl: {
      type: String,
      required: true
    },
    params: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      // actionUrl:"/api/cluecenter/jk/clue/excelImportCheck",//导入校验
      // importUrl:"/api/cluecenter/jk/clue/importClueByExcel",//导入
      // updateUrl:"/api/cluecenter/jk/clue/excelUpdateCheck",//更新校验
      // actionUrl_upload:"/api/cluecenter/jk/clue/updClues",//更新
      columns: this.createTableColumns(),
      errorList: [],
      isUpload: false,
      fileList: [],
      file: {},
      importLoading: false
    };
  },
  methods: {
    createTableColumns() {
      return [
        {
          title: 'excel表格行号',
          dataIndex: 'rowNO',
          filterType: 'input'
        },
        {
          title: '信息（错误/成功）',
          dataIndex: 'errorMsg',
          filterType: 'input'
        }
      ];
    },
    successHandler(val) {
      if (val == 1) {
        this.importLoading = true;
      } else {
        this.importLoading = false;
        this.fileList = val;
        if (val && val.length > 0) {
          if (val[0].url.errorList && val[0].url.errorList.length > 0) {
            this.errorList = val[0].url.errorList;
          } else {
            this.$message.success(`文件${this.title}成功`);
          }
        } else {
          this.errorList = [];
        }
        if (val[0].url.sucess) {
          this.isUpload = true;
        }
      }
    },
    errorHandler(val) {
      this.importLoading = false;
      if ('导入' != this.title) {
        this.$message.error('文件下载失败！');
      }
    },

    async saveHandle() {
      this.$refs.UploadFile.submitUpload();
      // console.log('===this.$refs.UploadFile.files==',this.$refs.UploadFile.files)
      // setTimeout(() => {
      //   console.log('===this.$refs.UploadFile==',this.$refs.UploadFile)
      //     if(this.$refs.UploadFile.fileList!=null && this.$refs.UploadFile.fileList.length>0){
      //       this.importLoading = true;
      //     }else{
      //       this.$message.error('请选择文件！');
      //     }
      //   }, 1000);
      // if(this.$refs.UploadFile.fileList!=null && this.$refs.UploadFile.fileList.length>0){
      //   this.importLoading = true;
      // }else{
      //   this.$message.error('请选择文件！');
      // }

      /*if(this.isUpload){
        let url = this.importUrl;
        let params = {
          clues:this.fileList.clue
        }
        const res = await axios.post(url, params);
        if (res.resultCode === 200) {
          this.$message.success(`文件${this.title}成功`);
          this.cancle()
        } else {
          this.errorHandle(res.errMsg);
        }
      }else{
        this.$message.error('请先上传正确的文件！');
      }*/
    },
    cancle() {
      // this.$emit("close")
      this.$emit('close', this.fileList);
    },
    async downLoadByUrl(url, params = {}) {
      const { data } = await axios({ url, params });
      return data;
    }
  }
};
</script>
